<template>
	<view class="box" v-if="list">
		<view class="header">
			<view class="left">
				<navigator url="/pages/quickly/medicalReport/entryMedical1"  class="template">
					<image src="../../../static/img/quickly/medicalReport/template@2x.png"></image>
					模板录入
				</navigator>
				<navigator url="/pages/quickly/medicalReport/photoUpload" class="photo">
					<image src="../../../static/img/quickly/medicalReport/photo@2x.png"></image>
					图片上传
				</navigator>
				<navigator  url="/pages/quickly/medicalReport/pdfUpload"  class="pdf">
					<image src="../../../static/img/quickly/medicalReport/pdf@2x.png"></image>
					PDF上传
				</navigator>
			</view>
			<view class="right">
				<image mode="scaleToFill" src="@/static/img/search.png"></image>
				<input type="text" placeholder="姓名" placeholder-style="color:#fff">
			</view>
		</view>
		<uni-swipe-action>
			<view class="content" v-if="list.length > 0">
				<view class="list-item" v-for="(item,index) in list" :key="index" >
					<uni-swipe-action-item :right-options="options"  @click="bindClick(item)">
						<view class="list-item-left" :style="{background:randomRgbaColor(index)}" @click="jump(item)">{{item.userName}}</view>
						<view :class="['list-item-right',item.type == 2 ? 'flex-center' : '']" @click="jump(item)">
							<view class="info">
								<p>体检报告{{item.type == 1?'(图片)':item.type == 2?'(PDF)':'(转录)'}}</p>
								<p>体检机构：{{item.organ}}</p>
								<p>体检时间：{{item.examinationDate}}</p>
							</view>
							<span v-if="!item.url" :class="['status',!item.status || item.status == 1?'not-active':'active']">{{!item.status || item.status == 1?'未签发':'已签发'}}</span>
							<span v-if="item.url" class="btn" @click="readPDF(item)">查看报告</span>
						</view>
					</uni-swipe-action-item>
				</view>
			</view>
		</uni-swipe-action>
		<view class="noneChating" v-if="list.length <= 0">
			<image src="@/static/img/headFeature/chattingNone.png"></image>
			<view>暂无数据</view>
		</view>
		<u-modal v-model="showModal" :show-cancel-button="true" @confirm="Modalconfirm" :content="showContent"></u-modal>
	</view>
</template>

<script>
	export default {
		data () {
			return {
				list:[],
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#EE2437' // 删除按钮背景  红的
					}
				}],
				showModal:false,
				showContent:'',
				page:{
					pageIndex:1,
					pageSize: 20
				}
			}
		},
		onLoad(){
			this.getlist()
		},
		methods:{
			randomRgbaColor(index) {
				var textcolor = ['#04D68F','#FF9869','#7079EA','#D17BE5'];
				var a = index < 3 ? textcolor[index] : textcolor[index%4] ;  
				return a; //返回rgba(r,g,b,a)格式颜色
			},
			getlist(){
				this.$api.HealthExaminationReportList({pageIndex:this.page.pageIndex,pageSize:this.page.pageSize}).then((res)=>{
					this.list = res.data.result.elements
				})
			},
			jump(item){
				if(item.type == 1){
					uni.navigateTo({
						url:'/pages/quickly/medicalReport/photoUpload?id='+item.id+'&status='+item.status
					})
				}
				if(item.status == 1) {
					this.$api.findByUserId(item.userId).then((res)=>{
						uni.navigateTo({
							url:encodeURI('/pages/quickly/medicalReport/entryMedical1?id='+item.id+'&reportNo='+item.medicalNumber+'&userId='+item.userId+'&userName='+item.realName+'&status='+item.status+'&sex='+res.data.result.sex)
						})
					})
				}else {
					uni.navigateTo({
						url:encodeURI('/pages/quickly/medicalReport/toView?id='+item.id)
					})
				}
				
			},
			bindClick(e){
				this.showModal = true
				this.showContent = '是否删除此体检报告'
				this.delItem = e
				// UserInfodelete
			},
			Modalconfirm(){
				if(this.delItem.sources == 2){
					this.$api.HealthExaminationReportDelete(this.delItem.id).then((res)=>{
						if(res.data.returnCode == 200){
							uni.showToast({
								title:'删除成功',
								icon:'none'
							})
							this.getlist()
						}
					})
				}else{
					this.$api.HealthExaminationReportDelete(this.delItem.id).then((res)=>{
						if(res.data.returnCode == 200){
							uni.showToast({
								title:'删除成功',
								icon:'none'
							})
							this.getlist()
						}
					})
				}
			},
			readPDF(item){
				window.open('http://health.jlm12580.com/web/viewer.html?file='+item.url)
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/css/quickly/medicalReport/list.scss';
	.list-item{
		.btn{
			width: 126rpx;
			height: 46rpx;
			background: #38CB97;
			color: #fff;
			font-size: 28rpx;
			border-radius: 6rpx;
			text-align: center;
			line-height: 46rpx;
		}
	}
	.flex-center{
		align-items: center;
	}
	
	.noneChating {
		padding-top: 280upx;
		image {
			display: block;
			margin: 0 auto;
			width: 260upx;
			height: 154upx;
		}
		view {
			margin: 24px auto;
			text-align: center;
			color: #333333;
			font-size: 13px;
		}
	}
</style>
